<template>
  <view class="attendance">
    <MainHeader>考勤管理</MainHeader>
    <view class="attendance-content">
      <view class="calendar-area">
        <van-calendar
          title=" "
          color="#419488"
          row-height="50"
          :poppable="false"
          :show-confirm="false"
          class="calendar"
          :min-date="minDate"
          :max-date="maxDate"
          @select="selectDate"
        />
      </view>
      <view class="attendance-pad">
        <view class="function-block">
          <img src="@/static/attendance-sign.svg" alt="" />
          <view class="function-title">
            今日打卡成功：
          </view>
          <view class="function-data">
            {{ attendanceData.punchCard }}
          </view>
          <view
            @click="goTo('/pages/classification/approval/fillClock/index')"
            class="function-button"
            >补打卡</view
          >
        </view>
        <!-- <view class="function-block">
          <img src="@/static/attendance-sign.svg" alt="" />
          <view class="function-title">
            今日外出：
          </view>
          <view class="function-data">
            {{ attendanceData.外出时长 }}
          </view>
          <view class="function-button">销外出</view>
        </view> -->
        <view class="function-block">
          <img src="@/static/attendance-sign.svg" alt="" />
          <view class="function-title">
            今日请假/调休：
          </view>
          <view class="function-data">
            {{ attendanceData.leave }}
          </view>
          <view
            @click="goTo('/pages/classification/approval/leave/index')"
            class="function-button"
            >请假</view
          >
        </view>
        <view class="function-block">
          <img src="@/static/attendance-sign.svg" alt="" />
          <view class="function-title">
            今日出差：
          </view>
          <view class="function-data">
            {{ attendanceData.travel }}
          </view>
          <view
            @click="goTo('/pages/classification/approval/travel/index')"
            class="function-button"
            >出差</view
          >
        </view>
        <view class="function-block">
          <img src="@/static/attendance-sign.svg" alt="" />
          <view class="function-title">
            今日申请加班：
          </view>
          <view class="function-data">
            {{ attendanceData.overtime }}
          </view>
          <view
            @click="goTo('/pages/classification/approval/overtime/index')"
            class="function-button"
            >加班</view
          >
        </view>
      </view>
      <view class="todos-list">
        <view class="title">
          等待销除
        </view>
        <view class="my-approval-list">
          <view
            class="notification-item"
            v-for="item in destroyList"
            :key="item.processId"
            @click="toDestory(item.processId)"
          >
            <view class="notice-logo">
              <img :src="switchApprovalLogo(item.processName)" />
            </view>
            <view class="notice-title"> {{ item.processName }}申请 </view>
            <view class="notice-desc">
              {{ formDateIOS(item.createTime).split(' ')[0] }}提交{{
                item.processName
              }}申请，{{ selectStateList[Number(item.processState)] }}
            </view>
            <view class="notice-time">
              {{ formDateIOS(item.createTime) }}
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>
<script src="./script.js"></script>
<style lang="less" src="./style.less"></style>
